<template>
  <el-tree
    :data="menus"
    :props="defaultProps"
    @node-click="handleNodeClick"
    ref="menuTree"
    node-key="catId"
   
  >
  </el-tree>
</template>

<script>
export default {
  data() {
    return {

      menus: [],
      defaultProps: {
        children: "children",
        label: "name",
      },
    
    };
  },
  
  created(){
    this.getMenus();
  },
  methods:{
    getMenus() {
      this.$http({
        url: this.$http.adornUrl("/product/category/list/tree"),
        method: "get",
      }).then(({ data }) => {
        console.log("成功获取到菜单数据！", data.data);
        this.menus = data.data;
      });
    },
    handleNodeClick(data,node,component){

        console.log("子组件category被点击：",data,node,component)
        this.$emit("tree-node-click",data,node,component)
    }
  }
};
</script>

<style>
</style>